<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>KBS</title>
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="fileinput/css/fileinput.css"/>
    <link href="font/iconfont.css" type="text/css" rel="stylesheet"/>
    <style type="text/css">
        .list_begin {
            width: 800px;
            font-size: 14px;
            line-height: 1.5em;
            margin: 20px 0;
            clear: both;
        }

        .list_begin a{
            text-decoration:none
        }

        h5 {
            font-size: 16px;
            margin: 0;
            padding: 0
        }

        .list_text {
            margin-top: 6px;
            white-space:normal;
            word-break:break-all;
            word-wrap:break-word
        }

        .l_show {
            float: left;
            margin-right: 20px;
            color: green;
            font-size: 12px;
        }

        .r_show {
            float: right;
            margin-left: 10px;
            font-size: 12px;
        }

        .r_show a {
            color: #666;
            text-decoration: none;
        }

        .r_show a:hover {
            cursor: pointer;
            color: #3385ff;
        }

        .list_tool {
            overflow: hidden
        }

        .icon {
            margin-right: 1px;
        }

        .show_more, .show_other {
            text-align: center;
            cursor: pointer;
        }

        .hidden_text {
            min-height: 21px;
            max-height: 50px;
            /*display: -webkit-box;*/
            /*-webkit-box-orient: vertical;*/
            /*-webkit-line-clamp: 2;*/
            overflow: hidden;
        }

        .nums {
            font-size: 14px;
            color: #999;
        }
    </style>
    <link href="toastr/toastr.min.css" rel="stylesheet"/>
    <script src="jquery/jquery.min.js"></script>
    <script src="bootstrap/js/bootstrap.min.js"></script>
    <script src="bootstrap/js/bootstrap-paginator.js"></script>
    <script src="fileinput/js/fileinput.js"></script>
    <script src="fileinput/js/locales/zh.js"></script>
    <script src="vue/vue.min.js"></script>
    <script src="toastr/toastr.min.js"></script>
    <script src="js/index.js"></script>

</head>
<body>
<div class="container">
    <div class="row" style="margin-bottom: 20px;"></div>
    <div class="row">
        <div class="col-md-6">
            <div class="input-group">
                <input id="search_text" type="text" class="form-control" placeholder="Search for..."/>
                <span class="input-group-btn">
                    <button class="btn btn-default" type="button" id="search_button"> Go! </button>
                </span>
            </div><!-- /input-group -->
        </div><!-- /.col-lg-6 -->
        <div class="col-md-1">
            <button id="add" type="button" class="btn btn-primary btn-block" data-toggle="modal"
                    data-target="#exampleModal"> add
            </button>
        </div>
        <div class="col-md-2"><p class="form-control-static nums" id="message"></p></div>
    </div>
    <div id="noDateMsg" class="row" style="margin: 20px;" hidden>
        <div class="col-md-2 col-md-offset-2"><h4>无搜索结果!</h4></div>
    </div>
    <div class="row">
        <div class="col-md-8">
            <div id="app">

                <div class="list_begin" v-for="list in lists">
                    <div v-if="list.highlight_content">
                        <h5><a target="_blank" v-html="list.title"></a></h5>
                        <div class="list_text to_hide toShow" v-html="list.highlight_content"></div>
                        <div class="list_text toHide" v-html="list.content" style="display:none;"></div>
                        <!--<div class="show_other">展开全部<span class="icon search_svg zhankai"></span></div>-->
                        <div class="list_tool">
                            <div class="l_show">
                                <span class="icon search_svg zuozhe"></span>
                                提交者：<span v-html="list.user"></span>
                            </div>
                            <div class="l_show">
                                <span class="icon search_svg riqi"></span>
                                提交时间：<span>{{ list.createTime }}</span></div>
                            <!--<div class="r_show"><a :href="list.href1" :data-id="list.id">查看</a></div>-->
                            <div class="r_show">
                                <a class="show_other" v-show=" 110 <= list.content.length"><span
                                        class="icon search_svg zhankai"></span>详情</a></div>
                            <div class="r_show">
                                <a v-if="list.fileId!==''" :href="'file/downloadFile?file_id=' + list.fileId"><span
                                        class="icon search_svg xiazai"></span>下载</a>
                            </div>
                            <div class="r_show">
                                <a :data-id="list.id" :data-fileid="list.fileId" onclick="del(this)"><span
                                        class="icon search_svg shanchu2"></span>删除</a>
                            </div>
                        </div>
                    </div>
                    <div v-else>
                        <h5><a target="_blank" v-html="list.title"></a></h5>
                        <div class="hidden_text toShow">
                            <div class="list_text" v-html="list.content"></div>
                        </div>
                        <!--<div class="show_more">展开全部<span class="icon search_svg zhankai"></span></div>-->
                        <div class="list_tool">
                            <div class="l_show">
                                <span class="icon search_svg zuozhe"></span>
                                提交者：<span v-html="list.user"></span>
                            </div>
                            <div class="l_show">
                                <span class="icon search_svg riqi"></span>
                                提交时间：<span>{{ list.createTime }} {{list.content.length}}</span></div>
                            <!--<div class="r_show"><a :href="list.href1" :data-id="list.id">查看</a></div>-->
                            <div class="r_show">
                                <a class="show_more" v-show=" 110 <= list.content.length"><span
                                        class="icon search_svg zhankai"></span>详情</a></div>
                            <div class="r_show">
                                <a v-if="list.fileId!==''" :href="'file/downloadFile?file_id=' + list.fileId"><span
                                        class="icon search_svg xiazai"></span>下载</a>
                            </div>
                            <div class="r_show">
                                <a :data-id="list.id" :data-fileid="list.fileId" onclick="del(this)"><span
                                        class="icon search_svg shanchu2"></span>删除</a>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
    <!-- 分页 -->
    <div class="row">
        <div class="col-md-6">
            <div id="example" style="text-align: center">
                <ul id="pageLimit"></ul>
            </div>
        </div>
    </div>

</div>

<!--  添加模板  -->

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
    <div class="modal-dialog" role="document">

        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="exampleModalLabel"> 添加文档 </h4>
            </div>
            <div class="modal-body">
                <form id="addDoc" action="addDoc" method="POST" enctype="multipart/form-data">


                    <div class="form-group">
                        <label for="title" class="control-label">文档名称:</label>
                        <input type="text" name="title" class="form-control" id="title" data-toggle="tooltip"
                               data-placement="top">
                    </div>

                    <div class="form-group">
                        <label for="content" class="control-label">内容:</label>
                        <textarea class="form-control" name="content" style="min-height: 150px" id="content"
                                  data-toggle="tooltip"
                                  data-placement="top"></textarea>
                    </div>

                    <div class="form-group">
                        <label for="user" class="control-label">提交者:</label>
                        <input type="text" name="user" class="form-control" id="user">
                    </div>

                    <div class="form-group">
                        <label for="input-file" class="control-label">上传文件:</label>
                        <input id="input-file" name="inputFile" class="file" multiple type="file"
                               data-show-preview="false" data-show-Upload="false"/>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary" id="addDocSubmit" data-toggle="tooltip"
                        data-placement="top">Save
                </button>
            </div>
        </div>
    </div>
</div>


</body>


</html>